
{{template "header" .}}


<div class="ibox float-e-margins" >
    <div class="row">
        <div class="col-lg-8"></div>
        <div class="col-lg-4"></div>

    </div>

    <div class="row">

        <div class="col-lg-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>ToServer List</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                        <a class="close-link">
                            <i class="fa fa-times"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th>ToServerKey</th>
                                <th>PluginName</th>
                                <th>PluginVersion</th>
                                <th>ConnUri</th>
                                <th>LastID</th>
                                <th>MaxConn</th>
                                <th>CurrentConn</th>
                                <th title="空闲连接数">AvailableConn</th>
                                <th>Notes</th>
                                <th>OP</th>
                            </tr>
                            </thead>
                            <tbody>
                            {{range $i, $v := .ToServerList}}
                            <tr id="ToServer_{{$i}}">
                                <td>{{$i}}</td>
                                <td>{{$v.PluginName}}</td>
                                <td>{{$v.PluginVersion}}</td>

                                <td title="{{$v.ConnUri}}">
                                <script type="text/javascript">filterIpAndPort("{{$v.ConnUri}}")</script>
                                </td>
                                <td>{{$v.LastID}}</td>
                                <td>
                                {{$v.MaxConn}}
                                </td>
                                <td>{{$v.CurrentConn}}</td>
                                <td>{{$v.AvailableConn}}</td>
                                <td>{{$v.Notes}}</td>
                                <td>
                                    <button data-toggle="button" class="btn-sm btn-danger delToServerBtn" type="button" >Del</button>
                                    <button data-toggle="button" class="btn-sm btn-primary updateMaxConnBtn" type="button" >修改</button>
                                    <a href="/synclist?toserverkey={{$i}}" target="_self">
                                    <button class="btn-sm btn-primary" type="button" >查看绑定表</button>
                                    </a>
                                </td>
                            </tr>
                            {{end}}
                            </tbody>
                        </table>
                    </div>

                </div>
            </div>
        </div>

    </div>

</div>

<!--update MaxConn start-->
<div class="modal inmodal fade" id="updateToServerInfoDiv" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h3 class="modal-title">Update ToServer</h3>
            </div>
            <div class="modal-body">


                    <div class="form-group">
                        <label class="col-sm-3 control-label">PluginName：</label>
                        <div class="col-sm-9"  style=" position: relative">
                            <input type="text" name="PluginName"  class="form-control" placeholder="PluginName" disabled>
                            <span class="help-block m-b-none">*</span>

                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">ToServerKey：</label>
                        <div class="col-sm-9"  style=" position: relative">
                            <input type="text" name="ToServerKey"  class="form-control" placeholder="ToServerKey" disabled>
                            <span class="help-block m-b-none">*</span>

                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">ConnUri：</label>
                        <div class="col-sm-9"  style=" position: relative">
                            <input type="text" name="Uri"  class="form-control" placeholder="ConnUri">
                            <span class="help-block m-b-none">*</span>

                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">MaxConn：</label>
                        <div class="col-sm-9"  style=" position: relative">
                            <input type="text" name="MaxConn"  class="form-control" placeholder="MaxConn">
                            <span class="help-block m-b-none">*最大连接数</span>

                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">Notes：</label>
                        <div class="col-sm-9">
                            <textarea type="text" name="Notes" class="form-control" placeholder="Notes"></textarea> <span class="help-block m-b-none">*</span>

                        </div>
                    </div>
                </table>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn-sm btn-white" data-dismiss="modal">关闭</button>
                <button type="button" class="btn-sm btn-primary updateMaxConnCommitBtn">保存</button>
            </div>
        </div>
    </div>
</div>
<!--update MaxConn over-->


<div class="ibox float-e-margins" id="addToServerContair">
    <div class="ibox-title">
        <h5>Add new Server</h5>
        <div class="ibox-tools">

            <a class="collapse-link">
                <i class="fa fa-chevron-up"></i>
            </a>
            <a class="close-link">
                <i class="fa fa-times"></i>
            </a>
        </div>
    </div>
    <div class="ibox-content">
        <div class="row row-lg">

            <div class="col-md-4">
                <div class="form-group">
                    <label class="col-sm-3 control-label">ToServerKey：</label>
                    <div class="col-sm-9">
                        <input type="text" name="toserverkey" id="toserverkey" class="form-control" placeholder="ToServerKey"> <span class="help-block m-b-none">* 字母,30个字母以内</span>

                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">Plugin：</label>
                    <div class="col-sm-9">
                        <select class="form-control" name="type" id="conn_type">
                        {{range $k, $val := .Drivers}}
                            <option value="{{$k}}" example='{{$val.ExampleConnUri}}' > {{$k}} - {{$val.Version}}</option>
                        {{end}}
                        </select><span class="help-block m-b-none"></span>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label">ConnUri：</label>
                    <div class="col-sm-9"  style=" position: relative">
                        <div style="position: absolute; right: -65px; top: 0px;">
                            <button data-toggle="button" class="btn-sm btn-warning " id="checkUriBtn" type="button">Check</button>
                        </div>
                        <input type="text" name="connuri" id="connuri" class="form-control" placeholder="ConnUri">
                        <span class="help-block m-b-none" id="connuri_example">*</span>

                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label">MaxConn：</label>
                    <div class="col-sm-9" >
                        <input type="text" name="maxconn" id="maxconn" class="form-control" value="20" placeholder="ConnUri">
                        <span class="help-block m-b-none">*最大连接数</span>
                    </div>
                </div>


                <div class="form-group">
                    <label class="col-sm-3 control-label">Notes：</label>
                    <div class="col-sm-9">
                        <textarea type="text" name="notes" id="notes" class="form-control" placeholder="Notes"></textarea> <span class="help-block m-b-none">*</span>

                    </div>
                </div>


                <div class="form-group">
                    <label class="col-sm-3 control-label">&nbsp;</label>
                    <div class="col-sm-9">
                        <button data-toggle="button" class="btn-sm btn-primary" id="addNewToServerBtn" type="button">提交</button>

                    </div>
                </div>

            </div>
        </div>
    </div>
</div>

{{template "footer" .}}
<script src="/js/bootstrap.min.js?v=3.3.6"></script>
<script src="/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>

<script type="text/javascript">
    var uriChecked = false;
    function changeUriExample(){
        var example = $("#conn_type").find("option:selected").attr("example");
        $("#connuri_example").text("*eg: "+example)
    }
    changeUriExample();
    $("#conn_type").change(
        function(){
            uriChecked = false;
            $("#checkUriBtn").show();
            changeUriExample();
        }
    );
    $("#connuri").change(
        function(){
            uriChecked = false;
            $("#checkUriBtn").show();
        }
    );

    function checkUri(plugin,uri) {
        var url = "/toserver/check_uri";
        var result = {status:false,msg:"unknow error"};
        $.ajax({
            type : "post",
            url : url,
            data:{connuri:uri,type:plugin},
            async : false,  //这里用同步 ,是为了当前界第一次请求进来执行init的时候,确保执行完了这个方法,再自动执行查询toserverList
            dataType:"json",
            success : function(data,status){
                if( status != 'success' ){
                    result.msg =  "reqeust error, reqeust status : "+statuss;
                    return false;
                }
                result = data;
            }
        });
        return result;
    }
    $("#checkUriBtn").click(
            function(){
                var connuri = $.trim($("#connuri").val());
                if (connuri == ""){
                    return false;
                }
                var conn_type = $("#conn_type").val();
                var data = checkUri(conn_type,connuri);
                if(!data.status){
                    alert(data.msg);
                    return false;
                }
                alert(data.msg);
                uriChecked = true;
                $("#checkUriBtn").hide();
            }
    );

    $("#addNewToServerBtn").click(
            function(){
                var toserverkey = $("#toserverkey").val();
                if(toserverkey=="" || toserverkey.length > 30){
                    $("#toserverkey").focus();
                    return false;
                }
                var connuri = $.trim($("#connuri").val());
                var type = $("#conn_type").val();
                var notes = $("#notes").val();
                var maxconn = $("#maxconn").val();
                if( connuri == "" || type=="" || notes==""){
                    alert("connuri,notes 不能为空")
                    return
                }
                if(maxconn == "" || isNaN(maxconn)){
                    alert("MaxConn 不能为空且必须为数字");
                    return
                }

                var url = "/toserver/add";
                $.post(
                        url,
                        { toserverkey: toserverkey,connuri:connuri,type:type,notes:notes,maxconn:maxconn},
                        function(data,status){
                            if( status != 'success' ){
                                alert("reqeust error, reqeust status : "+status);
                                return false;
                            }
                            if(!data.status){
                                alert(data.msg);
                                return false;
                            }
                            location.reload();
                        },
                        'json'
                );
            }
    );

    $(".delToServerBtn").click(
            function(){
                var trObj = $(this).parent().parent();
                var toServerKey = trObj.children().eq(0).text()
                if (!confirm("确定删除 [ "+ toServerKey+" ]?删除后不能恢复!!!!")){
                    return false;
                }
                var url = "/toserver/del";
                $.post(
                        url,
                        { toserverkey: toServerKey},
                        function(data,status){
                            if( status != 'success' ){
                                alert("reqeust error, reqeust status : "+status);
                                return false;
                            }
                            if(!data.status){
                                alert(data.msg);
                                return false;
                            }
                            trObj.remove();
                        },
                        'json'
                );
            }
    );

    $(".updateMaxConnBtn").click(
        function () {
            var MaxConn = $.trim($(this).parent().parent().children().eq(5).text());
            var Uri = $(this).parent().parent().children().eq(3).attr("title");
            var ToServerKey = $(this).parent().parent().children().eq(0).text();
            var PluginName = $(this).parent().parent().children().eq(1).text();
            var Notes = $(this).parent().parent().children().eq(8).text();

            $("#updateToServerInfoDiv input[name=ToServerKey]").val(ToServerKey);
            $("#updateToServerInfoDiv input[name=PluginName]").val(PluginName);
            $("#updateToServerInfoDiv input[name=MaxConn]").val(MaxConn);
            $("#updateToServerInfoDiv textarea[name=Notes]").val(Notes);
            $("#updateToServerInfoDiv input[name=Uri]").val(Uri);
            $("#updateToServerInfoDiv").modal('show');
        }
    );

    $(".updateMaxConnCommitBtn").click(
            function () {
                var MaxConn = $("#updateToServerInfoDiv input[name=MaxConn]").val();
                var ToServerKey = $("#updateToServerInfoDiv input[name=ToServerKey]").val();
                var PluginName = $("#updateToServerInfoDiv input[name=PluginName]").val();
                var Uri = $("#updateToServerInfoDiv input[name=Uri]").val();
                var Notes = $("#updateToServerInfoDiv textarea[name=Notes]").val();

                var url = "/toserver/update";
                if(MaxConn == "" || isNaN(MaxConn)){
                    alert("MaxConn 不能为空且必须为数字");
                    return
                }
                if( Uri == "" || notes==""){
                    alert("Uri,Notes 不能为空")
                    return
                }

                if(Uri != $("#ToServer_"+ToServerKey).children().eq(3).attr("title") ){
                    var data = checkUri(PluginName,Uri)
                    if(data.status == false){
                        alert(data.msg);
                        return;
                    }
                }
                $.post(
                        url,
                        { toserverkey: ToServerKey,maxconn:MaxConn,plugin:PluginName,notes:Notes,connuri:Uri},
                        function(data,status){
                            if( status != 'success' ){
                                alert("reqeust error, reqeust status : "+status);
                                return false;
                            }
                            if(!data.status){
                                alert(data.msg);
                                return false;
                            }
                            alert(data.msg);
                            $("#ToServer_"+ToServerKey).children().eq(3).attr("title",Uri);
                            $("#ToServer_"+ToServerKey).children().eq(3).text(Uri);
                            $("#ToServer_"+ToServerKey).children().eq(5).text(MaxConn);
                            $("#ToServer_"+ToServerKey).children().eq(8).text(Notes);
                        },
                        'json'
                );
                $("#updateToServerInfoDiv").modal('hide');
            }
    );

</script>
